<template>
  <div>
    <TitleBack :title-name="value"/>
    <div class="img">
      <img :src="personData.avatar" ref="img">
    </div>
    <van-cell-group>
      <van-cell title=" 用户名：" :value='personData.loginName'/>
      <van-cell title="昵称" :value="personData.userName"/>
      <van-cell title=" 手机号码：" :value='personData.phonenumber'/>
      <van-cell title="性别" :value="personData.sex"/>
      <van-cell title=" E-mail：" :value='personData.email'/>
      <van-cell title=" 简介：" :value='personData.remark'/>
    </van-cell-group>


  </div>
</template>

<script>
import TitleBack from "@/components/TitleBack";
import {getPersonalInformation} from "@/api/login-aip";


export default {
  name: "PersonalInformation",
  data() {
    return {
      value: "个人信息",
      personData: ''
    }
  },
  components: {
    TitleBack
  },
  created() {


    getPersonalInformation().then((res) => {

      this.personData = res.data
      // console.log(this.personData.sex)
      if (this.personData.sex === "0") {
        this.personData.sex = "男"
        console.log(this.personData.sex)
      } else if (this.personData.sex === "1") {
        this.personData.sex = "女"
      }
      console.log(this.personData)
    })
  }


}
</script>
<style scoped lang="less">
.img{
  width: 60px;
  height: 60px;
  margin: 10px auto;
  img{
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background-image: url("../../../public/images/默认头像.jpg");
    background-repeat: no-repeat;
    background-size: 100%;
  }
}
</style>